<template>
    <div class="DingDan-Page">
      <div class="panel-heading" style="color: #146276;font-size: 18px;padding-bottom: 0px;padding-left: 0px">限时抢购商品订单:</div>
      <div class="panel-body">
        <input class="form-control" v-model="search" style="width: 500px;float:left" placeholder="搜索客户">
      </div>
      <el-table :data="ShopList">
        <el-table-column prop="id" label="客户编号"/>
        <el-table-column prop="name" label="客户名"/>
        <el-table-column prop="shopname" label="购买商品"/>
        <el-table-column prop="zhuangtai" label="是否付款"/>
        <el-table-column prop="address" label="收货地址"/>
        <el-table-column label="状态操作">
          <template scope="scope">
            <router-link :to="'/'+scope.row.id" style="color: #177676">前往处理</router-link>
          </template>
        </el-table-column>
      </el-table>
      <div class="panel-heading" style="color: #146276;font-size: 18px;padding-bottom: 0px;padding-left: 0px;padding-top: 50px;">类别商品订单:</div>
      <el-table :data="ShopList1">
        <el-table-column prop="id" label="客户编号"/>
        <el-table-column prop="name" label="客户名"/>
        <el-table-column prop="name1" label="购买商品"/>
        <el-table-column prop="zhuangtai" label="是否付款"/>
        <el-table-column prop="address" label="收货地址"/>
        <el-table-column label="状态操作">
          <template scope="scope">
            <router-link :to="'/'+scope.row.id" style="color: #177676">前往处理</router-link>
          </template>
        </el-table-column>
      </el-table>
    </div>
</template>
<script>
  export default {
    name: 'DingDan-Page',
    data(){
      return {
        search:'',
        datas:[],
        data1s:[]
      }
    },
    computed:{
      ShopList(){
        return this.datas.filter(data=>{
          return data.name.indexOf(this.search)!=-1
        });
      },
      ShopList1(){
        return this.data1s.filter(data1=>{
          return data1.name.indexOf(this.search)!=-1
        });
      }
    },
    mounted() {
      this.$http.get('/dingdan').then(resp=>{
        this.datas = resp.data[0];
        this.data1s= resp.data[1];
      }).catch(err=>console.log(err));
    }
  }
</script>
<style lang="less">
    .DingDan-Page {
    }
</style>
